<!-- 用户导入弹窗 -->
<template>
  <el-dialog
      title="上传图片"
      :visible="visible"
      width="440px"
      :destroy-on-close="true"
      :lock-scroll="false"
      @update:visible="updateVisible">
    <el-upload
        v-loading="loading"
        action=""
        accept="image/*"
        :before-upload="beforeUpload"
        :show-file-list="false"
        drag
        class="ele-block">
      <i class="el-icon-upload"></i>
      <div class="el-upload__text">将文件拖到此处，或 <em>点击上传</em></div>
      <div class="el-upload__tip ele-text-center" slot="tip">
        <span>只能上传图片文件</span>
      </div>
    </el-upload>
  </el-dialog>
</template>

<script>


export default {
  name: 'UserImport',
  props: {
    // 是否打开弹窗
    visible: Boolean,
	mid:Number
  },
  data() {
    return {
      // 导入请求状态
      loading: false,
		czspid:''
     
    }
  },
  methods: {
	/* 上传 */
	beforeUpload(file) {
		
		if(!file.type.startsWith('image/')){
			this.$message.info("不是图片文件请重新选择")
			return;
		}
		
		console.log(this.czspid,'czspid')
		
		this.loading = true;
		let formData = new FormData();
		formData.append('file', file, this.czspid+'.jpg');
		this.$http.post('/scm/scm/xsmx/importTp', formData
		,{
			params:{
			mid: this.mid,
			spbh:this.czspid
		}
	}).then(res => {
		console.log(res);
		if (res.status ==200) {
		this.$message({type: 'success', message: res.statusText});
		this.updateVisible(false);
		} else {
		this.$message.error(res.data.msg);
		}
	}).catch(e => {
		this.$message.error(e.message);
	});
		return false;
	},
	
	/*传值id*/
	getid(id){
		console.log(id,'id');
		this.czspid=id;
	},

	/* 更新visible */
		updateVisible(value) {
		this.$emit('update:visible', value);
		}
	}
}
</script>

<style scoped>
.ele-block ::v-deep .el-upload,
.ele-block ::v-deep .el-upload-dragger {
  width: 100%;
}
</style>